<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('头程货件-查看')" />
	<th:block th:include="include :: businessCSS" />
	<style>
        .main-content{position: relative;}
        .topbtns{position:fixed;top: 0;width: 100%;z-index: 9999;background-color: #fff;}
		.preservationBtn{padding: 10px;margin: 0;position: fixed;top: 0;z-index: 9999;background: #fff;width: 100%;}
		.preservationBtn input{font-size: 16px;background-color: rgb(80, 138, 238);color: #fff;border: none;padding: 5px 30px;border-radius: 5px;cursor: pointer;}
		/* .layui-border-box{height: 350px !important;}
		.layui-table-body{height: 240px !important;} */
		.layui-table-tool-temp{padding-right: 30px;}
        .getDetailUpload,.getDetailUpload2{cursor: pointer;}
        .layui-table-tool-self{display: none;}

	</style>
</head>
<body class="no-skin">
<div class="main-container" id="main-container">
	<div class="main-content">
	<form class="layui-form head-form">
		<div class="north" style="background-color: #fff;margin-top: 55px;">
			<div class="layui-form-item preservationBtn">
				<button class="layui-btn layui-btn-normal dhicon btn-edit" type="button" lay-submit lay-filter="btn-edit" id="btn-edit">关闭</button>
			</div>
			<div class="forminput"></div>
		</div>
        <div style="width: 100%;height: 10px;background: #f6f6f6;"></div>
        <div>
            <table class="layui-hide" id="mjdhtable" lay-filter="mjtable"></table>
            <script type="text/html" id="zjtoolbar">
                <div style="padding: 16px;display: flex;justify-content: space-between;">
                    <div  style="font-weight: 700;font-size: 18px;">海外头程装箱清单</div>
            		<div>
                        <button class="layui-btn layui-btn-normal dhicon" th:classappend="${enableEdit} == 1 ?'':'layui-btn-disabled'" type="button" th:disabled="${enableEdit} == 1 ?false:true" lay-event="addbtn" id="btn-sh">新增</button>
                        <button class="layui-btn layui-btn-danger dhicon" th:classappend="${enableEdit} == 1 ?'':'layui-btn-disabled'" type="button" th:disabled="${enableEdit} == 1 ?false:true" lay-event="mjbtn_save" id="btn-sh">删除</button>
            		</div>
            	</div>
            </script>
        </div>

        <th:block th:include="include :: pageFooter" />
    </form>
	</div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: businessJS" />
<th:block th:include="include :: inlineJS" />


<script th:inline="javascript">
	/*<![CDATA[*/
	var prefix = ctx + "business/productbasis",
    	prefix2 = ctx + "base/company";

	var fields = [[${fields}]];
    var fieldsList = [[${fieldsList}]];
	var fieldsHiddenList = [[${fieldsHiddenList}]];
	var moduleTable = [[${moduleTable}]];
	var enableEdit = [[${enableEdit}]];
    //商品表格基础信息
	var gridColumns = [[${gridColumns}]];
	var gridColumnsZJ = [[${gridColumnsZJ}]];

    //商品表格基础信息
    // 商品列表数据
    var List=[[${List}]];
    //子件列表数据
    var sonList=[[${sonList}]];



	var $,layer,form,table,nid,noTable;

    layui.use(['laydate','form','layer','jquery','util','element','upload','table'], function () {
        $ = layui.$,layer = layui.layer,form = layui.form,laydate = layui.laydate,util = layui.util,element=layui.element,upload = layui.upload,table = layui.table;
        beforeInit();//表单初始化之前的动作集合
		//初始化操作
		headcom3()
        nid=$('#nid').val()
         // 保存按钮事件变化
        $(function(){
           $('.tp-save').attr('onclick','')
           $('.tp-save').attr('lay-filter','btn-edit')
           $('.tp-save').attr('lay-submit',true)
        })


        // 保存操作
        form.on('submit(btn-edit)', function(data){
			top.layui.admin.closeThisTabs()
		});

        var listData1=List ?List:[]
        var listData2=sonList ?sonList:[]
        // 初始化表格
            $.tablelist.init({
                elem: '#mjdhtable'
                ,data: listData1
                , page: false
                , even: true
                , limit: 10000
                , totalRow: gridColumnsZJ.totalRow
                , cols: [gridColumnsZJ.gridBody]
                , toolbar: '#zjtoolbar'
                , defaultToolbar: [{title: '列设置', layEvent: 'fieldSet', icon: 'layui-icon-set'}]
                , height: '320'
                , done: function (res, curr, count) {
                    listData1 = table.cache.mjdhtable;//每次重载都赋值更新表缓存
                },success:function(a,b,c){
                        console.log(a,b,c)
                }
            });

        //监听单元格编辑
        table.on('edit(mjtable)', function(obj){
            // calculation()
         });

        //监听单元格编辑
        table.on('edit(zjtable)', function(obj){
         });




        //商品表格操作
        table.on('toolbar(mjtable)', function (obj) {
            var selectedObject=""
            sessionStorage.setItem('mjdata',JSON.stringify(table.cache.mjdhtable))
            table.cache.mjdhtable.map((v,i)=>{
                if(selectedObject){
                    selectedObject+=','+v.spBm
                }else{
                    selectedObject+=v.spBm
                }
            })
            switch (obj.event) {
                case 'addbtn':
					listData1.push(gridColumns.gridNewLine);
					table.reload('mjdhtable', {data:listData1});
					break;
			    // layer.open({
                // 	type: 2,
                // 	area: [($(window).width() - 200)+'px', ($(window).height() - 100)+'px'],
                // 	fix: false,//不固定
                // 	offset: '10%',//距离顶部
                // 	maxmin: true,//最大最小化
                // 	shade: 0.3,//遮罩
                // 	title: '商品列表',
                // 	content: "/business/fbaplanorder/select2?pagetype=checkbox&by=direct&fmoduleTable="+moduleTable+"&selectedObject="+selectedObject,
                // 	btn: ['确定', '取消'],
                // 	shadeClose: true,// 弹层外区域关闭
                // 	yes: function(index, layero){
				// 		var res = window["layui-layer-iframe" + index].callbackdata();
				//         if(res.length > 0){
                //             var pcode=""
                //             $.each(res,function(i,v){
                //                 v.spBm=v.code
                //                 v.spMc=v.name
                //                 v.asin= v.guid
                //                 v.nameGoodsCn= v.nameCn
                //                 v.nameGoodsEn= v.nameEn
                //                 v.codeGoodsHs= v.codeHs
                //                 v.nameMaterialCn= v.materialCn
                //                 v.nameMaterialEn= v.materialEn
                //                 if(pcode){
                //                     pcode+=','+v.spBm
                //                 }else{
                //                     pcode+=v.spBm
                //                 }
				//         	})
				// 			layer.closeAll();
                //             var mjdata=sessionStorage.getItem('mjdata')
                //             if(mjdata){
                //                 mjdata=JSON.parse(mjdata)
                //                 let newall=[]
                //                 let endData = [];
                //                 var isdata=false
                //                 for (let i = 0; i < res.length; i++) {
                //                     var isdata=false
                //                     if (newall.indexOf(res[i].spBm) === -1) {
                //                         for (let n = 0; n < mjdata.length; n++) {
                //                             if (newall.indexOf(res[i].spBm) === -1) {
                //                                 if(res[i].spBm==mjdata[n].spBm){
                //                                    isdata=true
                //                                    endData.push(mjdata[n]);
                //                                    newall.push(mjdata[n].spBm);
                //                                 }
                //                             }
                //                         }
                //                         if(!isdata){
                //                             endData.push(res[i]);
                //                             newall.push(res[i].spBm);
                //                         }
                //                     }
                //                 }
                //                 table.reload('mjdhtable', {data:endData});
                //             }else{
                //                 table.reload('mjdhtable', {data:res});
                //             }
				//
				//         }else{
                //             layer.msg("请选择数据");
                //         }
                // 	}
                // });
				//
                //    break;

                case 'mjbtn_save'://删除
					var objdata=table.checkStatus('mjdhtable')
                    objdata=objdata.data
                    listData1= table.cache.mjdhtable;
					if(objdata.length>0){
						objdata.forEach(item => {
						listData1 = listData1.filter(items => items.guid!= item.guid);
					});
						table.reload('mjdhtable', {data:listData1});
                    }else{
                        layer.msg("请选择数据");
                    }
                    break;
            };
        });
    });


    /**
     * 回调弹框事件
     */
    function getMoreAfter(fieldsList,fields,tindex,fieldName,fieldSearchType,isSearch,isLayer,res) {//弹出框赋值回调
        $('#nameLogsticsWay').val(res.nameLogsticsWay)

    }


</script>

</body>
</html>